<html lang="zh" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"><head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="keywords" content="">
    <meta name="description" content="">
    <title>加班申请列表</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link href="/css/bootstrap.min.css" rel="stylesheet">
    <link href="/css/font-awesome.min.css" rel="stylesheet">
    <!-- bootstrap-table 表格插件样式 -->
    <link href="/ajax/libs/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="/css/animate.css" rel="stylesheet">
    <link href="/css/style.css" rel="stylesheet">
    <link href="/feitian/css/ry-ui.css" rel="stylesheet">

    <link rel="stylesheet" href="/ajax/libs/layer/theme/default/layer.css?v=3.1.1" id="layuicss-layer"><link rel="stylesheet" href="/ajax/libs/layer/theme/moon/style.css" id="layuicss-thememoonstylecss"><link id="layuicss-laydate" rel="stylesheet" href="/ajax/libs/layui/css/modules/laydate/default/laydate.css?v=5.0.9" media="all"></head>
<body class="gray-bg">
<div class="container-div">
    <div class="row">
        <div class="col-sm-12 search-collapse">
            <form id="formId">
                <div class="select-list">
                    <ul>
                        <li>
                            <p>用户id：</p>
                            <input type="text" name="userId">
                        </li>
                        <li class="select-time">
                            <p>加班开始时间：</p>
                            <input type="text" class="time-input" id="startTime" placeholder="开始时间" name="params[beginStartTime]" lay-key="3">
                            <span>-</span>
                            <input type="text" class="time-input" id="endTime" placeholder="结束时间" name="params[endStartTime]" lay-key="4">
                        </li>
                        <li class="select-time">
                            <p>加班结束时间：</p>
                            <input type="text" class="time-input" id="startTime" placeholder="开始时间" name="params[beginEndTime]" lay-key="5">
                            <span>-</span>
                            <input type="text" class="time-input" id="endTime" placeholder="结束时间" name="params[endEndTime]" lay-key="6">
                        </li>
                        <li>
                            <p>加班审批状态：</p>
                            <select name="status">
                                <option value="">所有</option>
                                <option value="1">待审批</option>
                                <option value="2">已通过</option>
                                <option value="3">取消</option>
                            </select>
                        </li>
                        <li>
                            <a class="btn btn-primary btn-rounded btn-sm" onclick="searchleaves()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                            <a class="btn btn-warning btn-rounded btn-sm" onclick="reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                        </li>
                    </ul>
                </div>
            </form>
        </div>


        <div class="col-sm-12 select-table table-striped">
            <div class="bootstrap-table"><div class="fixed-table-toolbar"><div class="bs-bars pull-left"><div class="btn-group-sm" id="toolbar" role="group">
                <a class="btn btn-success" href="/system/overtime/add">
                    <i class="fa fa-plus"></i> 添加
                </a>
                <a class="btn btn-primary single " >
                    <i class="fa fa-edit"></i> 修改
                </a>
                <a class="btn btn-danger multiple " id="removeall">
                    <i class="fa fa-remove"></i> 删除
                </a>
                <a class="btn btn-warning" onclick="$.table.exportExcel()">
                    <i class="fa fa-download"></i> 导出
                </a>
            </div>
            </div>
                <div class="columns columns-right btn-group pull-right">
                    <button class="btn btn-default btn-outline" type="button" name="showSearch" title="搜索">
                        <i class="glyphicon glyphicon-search"></i>
                    </button>
                    <button class="btn btn-default btn-outline" type="button" name="refresh" title="刷新" onclick="overtimeinit()">
                        <i class="glyphicon glyphicon-refresh icon-refresh"></i>
                    </button>
                    <button class="btn btn-default btn-outline" type="button" name="toggle" title="切换">
                        <i class="glyphicon glyphicon-list-alt icon-list-alt"></i>
                    </button><div class="keep-open btn-group" title="列">
                    <button type="button" class="btn btn-default btn-outline dropdown-toggle" data-toggle="dropdown">
                        <i class="glyphicon glyphicon-th icon-th"></i>
                        <span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu" role="menu">
                        <li><label><input type="checkbox" data-field="id" value="1" checked="checked">id</label></li>
                        <li><label><input type="checkbox" data-field="userId" value="2" checked="checked">用户id</label></li>
                        <li><label><input type="checkbox" data-field="userName" value="3" checked="checked"> 用户姓名</label></li>
                        <li><label><input type="checkbox" data-field="remark" value="4" checked="checked"> 请假说明</label></li>
                        <li><label><input type="checkbox" data-field="startTime" value="5" checked="checked"> 加班开始时间</label></li>
                        <li><label><input type="checkbox" data-field="endTime" value="6" checked="checked"> 加班结束时间</label></li>
                        <li><label><input type="checkbox" data-field="status" value="7" checked="checked"> 加班审批状态</label></li>
                        <li><label><input type="checkbox" data-field="8" value="8" checked="checked"> 操作</label></li>
                    </ul>
                    <script>
                        function dropdown(){
                            $(".dropdown-menu [type=checkbox]:checked").click(function(){
                                var df=$(this).attr("data-field");
                                $("#bootstrap-table [data-field="+df+"]").hide();
                                $(".dropdown-menu [type=checkbox]:checked").each(function() {
                                    var df=$(this).attr("data-field");
                                    $("#bootstrap-table [data-field="+df+"]").show();
                                });
                            })
                        }
                    </script>
                </div>
                </div>
            </div>
                <div class="fixed-table-container" style="padding-bottom: 0px;">
                    <div class="fixed-table-header" style="display: none;">
                        <table>

                        </table>
                    </div>
                    <div class="fixed-table-body">
                        <div class="fixed-table-loading" style="top: 42px; display: none;">正在努力地加载数据中，请稍候……</div>
                        <table id="bootstrap-table" class="table table-hover">
                            <thead>
                            <tr>
                                <th class="bs-checkbox " style="width: 36px; " data-field="0" tabindex="0">
                                    <div class="th-inner ">
                                        <input name="btSelectAll" type="checkbox" value="1">
                                    </div>
                                    <div class="fht-cell">

                                    </div>
                                </th>
                                <th style="" data-field="id" tabindex="0">
                                    <div class="th-inner ">id</div>
                                    <div class="fht-cell"></div>
                                </th>
                                <th style="" data-field="userId" tabindex="0">
                                    <div class="th-inner ">用户id</div>
                                    <div class="fht-cell"></div>
                                </th>
                                <th style="" data-field="userName" tabindex="0">
                                    <div class="th-inner ">用户姓名</div>
                                    <div class="fht-cell"></div>
                                </th>
                                <th style="" data-field="remark" tabindex="0">
                                <div class="th-inner ">请假说明</div>
                                <div class="fht-cell"></div>
                                </th>
                                <th style="" data-field="startTime" tabindex="0">
                                    <div class="th-inner ">加班开始时间</div>
                                    <div class="fht-cell">

                                    </div>
                                </th>
                                <th style="" data-field="endTime" tabindex="0">
                                    <div class="th-inner ">加班结束时间</div>
                                    <div class="fht-cell">

                                    </div>
                                </th>
                                <th style="" data-field="status" tabindex="0">
                                    <div class="th-inner ">加班审批状态</div>
                                    <div class="fht-cell"></div>
                                </th>
                                <th style="text-align: center; " data-field="8" tabindex="0">
                                    <div class="th-inner ">操作</div>
                                    <div class="fht-cell"></div>
                                </th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr data-index="0">
<!--                                <td class="bs-checkbox ">-->
<!--                                    <input data-index="0" name="btSelectItem" type="checkbox">-->
<!--                                </td>-->
<!--                                <td style="">1</td>-->
<!--                                <td style="">吴玮</td>-->
<!--                                <td style="">-</td>-->
<!--                                <td style="">2020-02-12 00:00:00</td>-->
<!--                                <td style="">2020-02-13 00:00:00</td>-->
<!--                                <td style="">已批准</td>-->
<!--                                <td style="text-align: center; ">-->
<!--                                    <a class="btn btn-success btn-xs " href="javascript:void(0)" onclick="$.operate.edit('1')"><i class="fa fa-edit"></i>编辑</a>-->
<!--                                    <a class="btn btn-danger btn-xs " href="javascript:void(0)" onclick="$.operate.remove('1')"><i class="fa fa-remove"></i>删除</a>-->
<!--                                </td>-->
                            </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="fixed-table-footer" style="display: none;">
                        <table>
                            <tbody>
                            <tr>

                            </tr>
                            </tbody></table>
                    </div>
                    <div class="fixed-table-pagination" style="display: block;">
<!--                        <div class="pull-left pagination-detail">-->
<!--                            <span class="pagination-info">第 1 到 1 条，共  1 条记录。</span>-->
<!--                            <span class="page-list" style="display: none;">-->
<!--                                <span class="btn-group dropup">-->
<!--                                    <button type="button" class="btn btn-default btn-outline dropdown-toggle" data-toggle="dropdown">-->
<!--                                        <span class="page-size">10</span>-->
<!--                                        <span class="caret"></span>-->
<!--                                    </button>-->
<!--                                    <ul class="dropdown-menu" role="menu">-->
<!--                                        <li class="active">-->
<!--                                            <a href="javascript:void(0)">10</a>-->
<!--                                        </li>-->
<!--                                    </ul>-->
<!--                                </span> 条记录每页</span>-->
<!--                        </div>-->
<!--                        <div class="pull-right pagination" style="display: none;">-->
<!--                            <ul class="pagination pagination-outline">-->
<!--                                <li class="page-pre"><a href="javascript:void(0)">‹</a></li>-->
<!--                                <li class="page-number active"><a href="javascript:void(0)">1</a></li>-->
<!--                                <li class="page-next"><a href="javascript:void(0)">›</a></li>-->
<!--                            </ul>-->
<!--                        </div>-->
                    </div>
                </div>
            </div>
            <div class="clearfix">

            </div>
        </div>
    </div>
</div>

<script src="/js/jquery.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
<!-- bootstrap-table 表格插件 -->
<script src="/ajax/libs/bootstrap-table/bootstrap-table.min.js"></script>
<script src="/ajax/libs/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
<script src="/ajax/libs/bootstrap-table/extensions/mobile/bootstrap-table-mobile.js"></script>
<script src="/ajax/libs/bootstrap-table/extensions/toolbar/bootstrap-table-toolbar.min.js"></script>
<script src="/ajax/libs/bootstrap-table/extensions/columns/bootstrap-table-fixed-columns.js"></script>
<!-- jquery-validate 表单验证插件 -->
<script src="/ajax/libs/validate/jquery.validate.min.js"></script>
<script src="/ajax/libs/validate/messages_zh.min.js"></script>
<script src="/ajax/libs/validate/jquery.validate.extend.js"></script>
<!-- jquery-validate 表单树插件 -->
<script src="/ajax/libs/bootstrap-treetable/bootstrap-treetable.js"></script>
<!-- jquery-export 表格导出插件 -->
<script src="/ajax/libs/bootstrap-table/extensions/export/bootstrap-table-export.js"></script>
<script src="/ajax/libs/bootstrap-table/extensions/export/tableExport.js"></script>
<!-- 遮罩层 -->
<script src="/ajax/libs/blockUI/jquery.blockUI.js"></script>
<script src="/ajax/libs/iCheck/icheck.min.js"></script>
<script src="/ajax/libs/layer/layer.min.js"></script>
<script src="/ajax/libs/layui/layui.js"></script>
<script src="/feitian/js/common.js?v=4.1.0"></script>
<script src="/feitian/js/ry-ui.js?v=4.1.0"></script>
<script> var ctx = "\/"; </script>
<script>
 $(function () {
    overtimeinit();
    remove();
    removeAll();
    btSelectAll();
    dropdown();
 })
 function removeAll(){
     $("#removeall").unbind("click").click(function(){
         var arry=[];
         $("#bootstrap-table [name=btSelectItem]:checked").each(function(){
             arry.push($(this).val());
         });
         var flag=confirm("确认要删除？");
         if (flag){
             $.ajax({
                 url:"/system/overtime/removes",
                 type:"post",
                 data:{
                     array: arry.toString(),
                 },
                 success:function(data){
                     if (data){
                         $("#bootstrap-table [name=btSelectItem]:checked").parents("tr").remove();
                     }
                 }
             })
         }
     })
 }
 function remove(){
     $(".del").unbind("click").click(function(){
         var id=$(this).parents("tr").children("td:eq(1)");
         var flag=confirm("确认要删除？");
         if (flag){
             $.ajax({
                 url:"/system/overtime/remove",
                 data:{
                     id:id.html(),
                 },
                 success:function(data){
                     if (data){
                         id.parents("tr").remove();
                     }
                 }
             })
         }

     })
 }
 function btSelectAll(){
     $("#bootstrap-table [name=btSelectAll]").unbind("click").click(function(){
         var flag=$("#bootstrap-table [name=btSelectAll]:checked").val();
         if (flag==="1") {
             $("#bootstrap-table [name=btSelectItem]").attr("checked","checked")
         }
         if (flag==null) {
             $("#bootstrap-table [name=btSelectItem]").removeAttr("checked")
         }

     })
 }
 var select=$("<form></form>");
 function searchleaves(){
     select=$("#formId");
     overtimeinit();
 }
 function reset(){
     $("#formId")[0].reset();
 }
 function overtimeinit() {
     $("#bootstrap-table tr:gt(0)").remove();
     $.ajax({
         url:"/system/overtime/getovertimes",
         dataType:"json",
         data:select.serialize(),
         async:false,
         success:function (overtimes){
             $(overtimes).each(function(i,overtime){
                 var username='';
                 $.ajax({
                     url:"/getuserbyid",
                     dataType:"json",
                     async:false,
                     data:{
                         id:overtime.userId
                     },
                     success:function(data){
                         username=data.userName;
                     }
                 })
                 var tr=$("<tr></tr>");
                 var td0=$("<td class='bs-checkbox'><input name='btSelectItem' type='checkbox' value="+overtime.id+" ></td>")
                 var td1=$("<td data-field='id' >"+overtime.id+"</td>");
                 var td01=$("<td data-field='userId'>"+overtime.userId+"</td>")
                 var td2=$("<td data-field='userName'>"+username+"</td>");
                 var td3=$("<td data-field='remark'>"+overtime.remark+"</td>");
                 var td4=$("<td data-field='startTime'>"+overtime.startTime+"</td>");
                 var td5=$("<td data-field='endTime'>"+overtime.endTime+"</td>");
                 value=overtime.status;
                 var statusname='';
                 if(value == '1'){
                     statusname='待审批';
                 } else if(value == '2'){
                     statusname='已通过'
                 } else if(value == '3'){
                     statusname='已取消';
                 }
                 var td6=$("<td data-field='status' >"+statusname+"</td>");
                 var td7=$("<td data-field='8' style='text-align: center';></td>");
                 var a1=$("<a class='btn btn-success btn-xs' href='/system/overtime/update?id="+overtime.id+"'><i class='fa fa-edit'></i>编辑</a>");
                 var a2=$("<a class='btn btn-danger btn-xs del'><i class='fa fa-remove'></i>删除</a>");
                 td7.append(a1,a2);
                 tr.append(td0,td1,td01,td2,td3,td4,td5,td6,td7)
                 $("#bootstrap-table").append(tr);
                 remove()
             })
         }

     })
 }
</script>


</body></html>